<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/mui.picker.css" rel="stylesheet" />
		<link href="css/mui.poppicker.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="lib/leaflet/leaflet.css">
		<!--		<link href="http://106.14.205.221/arcgis_js_api/library/3.23/esri/css/esri.css" rel="stylesheet" />
-->
		<!--		<link rel="stylesheet" href="http://106.14.205.221/arcgis_js_api/library/4.10/esri/css/main.css" />
-->
		<link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet.markercluster@1.0.4/dist/MarkerCluster.Default.css">
		<link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet.markercluster@1.0.4/dist/MarkerCluster.css">

		<!-- <link rel="stylesheet" type="text/css" href="./lib/leaflet/MarkerCluster/default.css">
		<link rel="stylesheet" type="text/css" href="./lib/leaflet/MarkerCluster/mark.css"> -->
		<link rel="stylesheet" href="lib/font-awesome-4.7.0/css/font-awesome.min.css">
		<link rel="stylesheet" type="text/css" href="./css/timeline.css" />
		<link href="css/mystyle.css" rel="stylesheet" />
		<script type="text/javascript" src="lib/jquery-2.1.0.min.js"></script>
		<!-- <script type="text/javascript" src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> -->
		<!-- <script type="text/javascript" src="lib/jquery.min.js"></script> -->
	</head>
	<!-- 单独定义折叠面板右侧的向下箭头样式 -->
	<style type="text/css">
		.mui-navigate-right:after {
			color: #FFFFFF
		}
	</style>

	<body>
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
			<!-- <aside id="offCanvasSide" class="mui-off-canvas-right">
				<div id="offCanvasSideScroll2" class="mui-scroll-wrapper" style="background-color: #55ff7f;">
					<div class="mui-scroll">
						33333
					</div>
				</div>
			</aside> -->

			<aside id="offCanvasSide2" class="mui-off-canvas-right">
				<div id="offCanvasSideScroll" class="mui-scroll-wrapper" style="background-color: #ffffff;">
					<div class="mui-scroll">
						<div id="search" style="color: #000000;">
							<!-- <ul>
								<li>城南花开</li> 
								<li>城南花开</li>
								<li>城南花开</li>
								<li>城南花开</li>
								<li>城南花开</li>
								<li>城南花开</li>
							</ul> -->
							<!-- <div class="title" style="width:100%; height:0px;line-height: 0px;margin-top: 100px;background-color:#464646;padding-left:15px;"
							 id="resulitTitle">周边查询</div> -->
						</div>
						<div class="myFunctionDiv" style="display:block;" id="resultListWin">
							<div class="title" style="width:100%; height:0px;line-height: 0px;font-size: 15px;background-color:#464646;padding-left:15px;display: none;"
							 id="resulitTitle">周边查询</div>
							<div id="sumInstru" style="color:#179efa; height:40px; font-size:14px;line-height: 20px;margin-top:20px;margin-left:15px;margin-right:15px;">
							</div>
							<div id='scrollDiv' class="mui-scroll-wrapper">
								<div class="mui-scroll">
									<ul class="mui-table-view" id="resultList" style="position: relative;z-index: 200;">

									</ul>
								</div>
							</div>
						</div>
						<div class="myFunctionDiv" style="display:none;" id="attachmentWin">
							<div class="title" style="width:100%; height:50px;line-height: 50px;font-size: 22px;background-color:#464646;padding-left:15px;display: none">附件列表</div>
							<div id="attachmentSumInstru" style="color:#179efa; height:40px; font-size:14px;line-height: 20px;margin-top:20px;margin-left:15px;margin-right:15px;">
							</div>
							<div id='attachmentScrollDiv' class="mui-scroll-wrapper">
								<div class="mui-scroll">
									<ul class="mui-table-view" id="attachmentResultList">
									</ul>
								</div>
							</div>
						</div>

						<div class="myFunctionDiv" style="display:none;" id="layerWin">
							<div style="width: 100%;height: 80px;display:flex;margin-top: 40px;">
								<div style="width: 50%;padding-left: 20px;">
									<img id="standardMapImg" class="selectedImg" src="img/map.png" style="width: 90px;height:60px;" />
									<span id="standardMapSpan" class="selectedSpan" style="font-size:14px;color: #515151;padding-left: 16px;">标准地图</span>
								</div>
								<div style="width: 50%;padding-left: 20px;">
									<img id="airMapImg" src="img/img.png" style="width: 90px;height:60px;" />
									<span id="airMapSpan" style="font-size:14px;color: #515151;padding-left: 16px;">卫星地图</span>
								</div>
							</div>


							<ul class="mui-table-view" style="margin-top: 20px;">
								<li class="mui-table-view-cell mui-collapse" style="background-color: #8acac6;">
									<a class="mui-navigate-right" href="#"><i class="fa fa-map-o" aria-hidden="true" style="margin-right: 0.6125rem;color: #FFFFFF;"></i>历史影像</a>
									<div class="mui-collapse-content">
										<!-- <div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">影像图</span>
											<div class="mui-input-row mui-input-range" style="float: left;width: 100px;margin-left: 15px;">
												
											</div>
											<div id="imageSwitch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div> -->


										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">2020年三季度</span>
											<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
											-->
											<div class="mui-input-row mui-input-range" style="float: left;width: 60px;margin-left: 20px;">

											</div>
											<div id="img202003Switch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">2020年二季度</span>
											<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
											-->
											<div class="mui-input-row mui-input-range" style="float: left;width: 60px;margin-left: 20px;">

											</div>
											<div id="img202002Switch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">2020年一季度</span>
											<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
											-->
											<div class="mui-input-row mui-input-range" style="float: left;width: 60px;margin-left: 20px;">

											</div>
											<div id="img202001Switch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">2019年四季度</span>
											<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
											-->
											<div class="mui-input-row mui-input-range" style="float: left;width: 60px;margin-left: 20px;">

											</div>
											<div id="img201904Switch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">2019年三季度</span>
											<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
											-->
											<div class="mui-input-row mui-input-range" style="float: left;width: 60px;margin-left: 20px;">

											</div>
											<div id="img201903Switch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
									</div>
								</li>
								<li class="mui-table-view-cell mui-collapse" style="background-color: #8acac6;margin-top: 0.625rem;">
									<a class="mui-navigate-right" href="#"><i class="fa fa-envelope-open-o" aria-hidden="true" style="margin-right: 0.6125rem;color: #FFFFFF;"></i>土地规划图</a>
									<div class="mui-collapse-content">
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">地形图</span>
											<div class="mui-input-row mui-input-range" style="float: left;width: 100px;margin-left: 30px;">
												<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
										-->
											</div>
											<div id="terrianSwitch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">规划图</span>
											<div class="mui-input-row mui-input-range" style="float: left;width: 100px;margin-left: 30px;">
												<!--									<input id="deepwellLayerRangeInput2" type="range" min="0" value="100" max="100">
										-->
											</div>
											<div id="planSwitch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">三调图</span>
											<div id="deepwellClusterLayerRange" class="mui-input-row mui-input-range" style="float: left;width: 100px;margin-left: 30px;">
												<!--									<input id="deepwellClusterLayerInput" type="range" min="0" value="100" max="100">
										-->
											</div>
											<div id="landSwitch" class="mui-switch mui-switch-blue mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
									</div>
								</li>
								<li class="mui-table-view-cell mui-collapse" style="background-color: #8acac6;margin-top: 10px;">
									<a class="mui-navigate-right" href="#"><i class="fa fa-star-o" aria-hidden="true" style="margin-right: 0.6125rem;color: #FFFFFF;font-size: 1.125rem;"></i>亮点项目</a>
									<div class="mui-collapse-content">
										<div style="display: flex;margin-top: 5px;">
											<span style="font-size: 14px;color: #515151;float: left;">亮点图</span>
											<!--									<input id="deepwellLayerRangeInput3" type="range" min="0" value="100" max="100">
											-->
											<div class="mui-input-row mui-input-range" style="float: left;width:100px;margin-left: 30px;">

											</div>
											<div id="starSwitch" class="mui-switch mui-switch-blue  mui-switch-mini" style="float: left;">
												<div class="mui-switch-handle"></div>
											</div>
										</div>
									</div>
								</li>
							</ul>

						</div>
					</div>
				</div>
			</aside>

			<div class="mui-inner-wrap">
				<div class="mui-content " style="background-color: transparent;" id="offCanvasWrapper2">
					<div style="width: 100%;height: 100%;margin-top: 0px;padding-top: 0px;background-color: white;z-index: -1;position:absolute;"
					 class="map" id="map"></div>
					<div class="box-shadow moveTransition" style="display:block;width: 40%;height:30px;top:-20%;background-color:#005dff;color:#fff;z-index: 1;position:absolute;margin-left:85%;padding-left:15px;font-size:14px;text-align: left;line-height:30px;background-repeat:no-repeat;background-position-y: center;background-size:150px;border-radius: 20px;"
					 id="cehua">记录</div>
				</div>
				<div id="shortcuts">
					<div id="sideBar_1" class=" box-shadow" style="border-radius: 3px;   background: #f6f8f7;margin-top: 77px;position: absolute;z-index:10;margin-left:85%;margin-right:2%;height:40px;">
						<a id="layerBtn" class="btn-xs dk_on" style="background-image: url(img/layers.svg); background-repeat: no-repeat;background-position: center;border-radius: 0px;display:block; "></a>
					</div>
					<div id="sideBar_2" class="container box-shadow" style="margin-top: 126px;position: absolute;z-index:10;margin-left:85%;margin-right:2%;">
						<a id="searchMultiplBtn" class="btn-xs" style="background-image: url(img/filter.svg); background-repeat: no-repeat;background-position: center;border-bottom:1px solid grey        ;border-radius: 0px; display:block;"></a>
						<!--						<a id="bookmarkBtn" class="btn-xs" style="background-image: url(img/bookmark.svg); background-repeat: no-repeat;background-position: center;border-bottom:1px solid grey;border-radius: 0px; display:block;"></a>
-->
						<!--						<a id="statisticsBtn" class="btn-xs" style="background-image: url(img/statistics.svg); background-repeat: no-repeat;background-position: center;border-bottom:1px solid grey;border-radius: 0px; display:block;"></a>
-->
						<a id="measureBtn" class="btn-xs" style="background-image: url(img/measure.svg); background-repeat: no-repeat;background-position: center;border-bottom:1px solid grey;border-radius: 0px; display:block;"></a>
						<a id="areaBtn" class="btn-xs" style="background-image: url(img/area.svg); background-repeat: no-repeat;background-position: center;border-bottom:1px solid grey;border-radius: 0px; display:block;"></a>
						<a id="historyBtn" class="btn-xs" style="background-image: url(img/history.svg); background-repeat: no-repeat;background-position: center;border-bottom:1px solid grey;border-radius: 0px; display:block;"></a>
						<a id="eraserBtn" class="btn-xs" style="background-image: url(img/erase.svg); background-repeat: no-repeat;background-position: center;border-radius: 0px; display:block;"></a>
					</div>
				</div>
				<a id="bottomBar_left" class="box-shadow moveTransition" style="background-color:white;background-image:url(img/location.svg);color:#3062a2;margin-left: 15px;position: absolute;z-index:20;width:36px;border-radius: 36px;height:36px; background-position: center;background-repeat: no-repeat;">
				</a>
				<div class="box-shadow" style="background-color: white;position: absolute;width:96%;margin-top:25px;margin-left:2%;margin-right:2%;z-index: 1;border-radius: 5px;">
					<div id="userInfo" style="width:40px;height:40px;;position: absolute;z-index: 1;border-radius: 5px;background-image: url(img/user.svg);background-position: center;background-size:26px 26px;  background-repeat:  no-repeat"></div>
					<!--<input id="input_search"type="text"  placeholder="输入地址、二级公司名称、权利人关键字查询" style="display:block;margin-left:30px;width:90%;margin-top:0;margin-bottom:0;font-size:14px;margin-right:10px;border:none;">-->
					<div class="mui-input-row" style="display:block;margin-left:30px;width:90%;margin-top:0;margin-bottom:0;margin-right:10px;">
						<input id="input_search" placeholder="输入关键词模糊查询" class="mui-input-clear" id="tdarea" type="text" placeholder=""
						 style="margin-top:0;margin-bottom:0;font-size:14px;border:none;">
					</div>
					<!-- 新增点击按钮 -->
					<!-- <a href="#picture">
						<button type="button" class="mui-btn mui-btn-royal mui-btn-outlined">紫色</button>
					</a> -->

				</div>
				<div class="mui-input-row mui-input-range" id="ranges" style="width: 100%; position: absolute;z-index: 100;top: -4.0625rem;">
					<!-- <label>滑块</label> -->
					<!-- <input type="range" min="0" max="10" id="Slider"" > -->
				</div>
				<div class="bar">
					<!-- <input class="bar-input" type="radio" name="input" id="input_0" /> -->
					<div class="bar-view">
						<label class="bar-button" for="input_0">
							<div style="margin: 4px auto auto;" id="">
								10月
							</div>
						</label>
					</div>
					<!-- <input class="bar-input" type="radio" name="input" id="input_1" /> -->
					<div class="bar-view">
						<label class="bar-button" for="input_1">
							<div style="margin: 4px auto auto;" id="">
								9月
							</div>
						</label>
					</div>
					<!-- <input class="bar-input" type="radio" name="input" id="input_2" /> -->
					<div class="bar-view">
						<label class="bar-button" for="input_2">
							<div style="margin: 4px auto auto;" id="">
							8月
							</div>
						</label>
					</div>
					<!-- <input class="bar-input" type="radio" name="input" id="input_3" /> -->
					<div class="bar-view">
						<label class="bar-button" for="input_3">
							<div style="margin: 4px auto auto;" id="">
								5月
							</div>
						</label>
					</div>
					<!-- <input class="bar-input" type="radio" name="input" id="input_4" /> -->
					<div class="bar-view">
						<label class="bar-button" id="first" for="input_4">
							<div style="margin: 4px auto auto;" id="">
								2月
							</div>
						</label>
					</div>
				</div>

				<div id="bottomContainer" class="box-shadow2 moveTransition " style="background-color: white;position: absolute;top: 10px; width:100%;height:180px;z-index: 1;border-top-left-radius:10px;border-top-right-radius:10px">
					<div style="height: 83px;">
						<div style="margin-top: 10px;margin-left:20px ;">
							<span id="detailInfoTitle" style="font-size: 14px;color:#179efa;font-weight: bold;"> </span>
						</div>
						<div style="margin-top: 5px;margin-left:20px ;">
							<span id="detailInfoContent" style="font-size: 14px;color:#515151;"> </span>
						</div>
					</div>
					<div id="bottomContainerBtn" style="width: 90%;display: inline-block; height: 30px;margin-left:5%;margin-top: 0px;border-top:  1px grey solid;padding-top: 8px;">
						<a id="detailInfoHref" style="float:left;width: 33%;">
							<i class="fa fa-list mui-icon" style="font-size:14px;color:#515151;margin-left: 25%"></i>
							<span class="mui-tab-label" style="font-size:14px;color:#515151;">详情信息</span>
						</a>
						<!-- <a id="opcWinHref" style="float:left;width: 33%;">
							<i class="fa fa-dashboard mui-icon" style="font-size:14px;color:#515151;margin-left: 25%;"></i>
							<span class="mui-tab-label" style="font-size:14px;color:#515151;">设备状态</span>
						</a> -->
						<a id="TimeStation" style="float:left;width: 33%;">
							<i class="fa fa-dashboard mui-icon" style="font-size:14px;color:#515151;margin-left: 25%;"></i>
							<span class="mui-tab-label" style="font-size:14px;color:#515151;">项目进度</span>
						</a>
						<!--<a id="attachmentWinHref" style="float:left;width: 25%;">
							<i class="fa fa-file-o mui-icon" style="font-size:14px;color:#515151;margin-left: 25%;"></i>
							<span class="mui-tab-label" style="font-size:14px;color:#515151;">附件</span>
						</a>-->
						<a id="pictureWinHref" style="float:left;width: 33%;">
							<i class="fa fa-picture-o mui-icon" style="font-size:14px;color:#515151;margin-left: 25%;"></i>
							<span class="mui-tab-label" style="font-size:14px;color:#515151;">现场情况</span>
						</a>
					</div>
				</div>
			</div>
			<div id="canvasBackdrop" class="mui-off-canvas-backdrop"></div>
		</div>
		</div>

		<script src="lib/mui/mui.min.js"></script>
		<script src="lib/mui/mui.picker.js"></script>
		<script src="lib/mui/mui.poppicker.js"></script>
		<!--<script type="text/javascript">
			var dojoConfig = {
				parseOnLoad: true,
				packages: [{
					name: "extLayers",
					location: location.pathname.replace(/\/[^/]*$/, '') + '/plugins/extLayers'
				}]
			};
		</script>-->

		<!--		<script src="http://106.14.205.221/arcgis_js_api/library/3.23/init.js"></script>
-->
		<!--<script src="http://106.14.205.221/arcgis_js_api/library/4.10/init.js"></script>
-->
		<script type="text/javascript" src="lib/leaflet/leaflet.js"></script>
		<script type="text/javascript" src="lib/leaflet/esri-leaflet.js"></script>
		<script type="text/javascript" src='lib/leaflet/leaflet.ChineseTmsProviders.js'></script>
		<script src="https://unpkg.com/leaflet.markercluster@1.0.4/dist/leaflet.markercluster.js"></script>
		<script src="https://unpkg.com/esri-leaflet-cluster@2.0.0/dist/esri-leaflet-cluster.js"></script>
		<!-- 	<script src="./lib/leaflet/MarkerCluster/default.js"></script>
		<script src="./lib/leaflet/MarkerCluster/mark.js"></script> -->
		<!--		<script src='https://cdn.bootcss.com/Turf.js/5.1.6/turf.min.js'></script>
-->
		<script type="text/javascript" src='lib/turf.min.js'></script>
		<script type="text/javascript" src="js/serviceUrlConfig.js"></script>
		<script type="text/javascript" src="js/mapInit.js"></script>
		<script type="text/javascript" src="js/winVisibleControl.js"></script>
		<script type="text/javascript" src="js/polygonSearch.js"></script>
		<script type="text/javascript" src="js/query.js"></script>
		<script type="text/javascript" src="js/drawTool.js"></script>
		<script type="text/javascript" src="js/identify.js"></script>
		<script type="text/javascript" src="lib/gps.js"></script>
		<script>
			mui.init({
				gestureConfig: {
					tap: true, //默认为true
					doubletap: true, //默认为false
					longtap: true, //默认为false
					swipe: true, //默认为true
					drag: true, //默认为true
					hold: false, //默认为false，不监听
					release: false //默认为false，不监听
				}
			});
			// 底部弹窗js
			mui('#picture').on('tap', 'li>a', function() {
				mui.alert("你刚点击了" + this.innerHTML + "按钮");

				// mui("#picture").popover('toggle');//这是可以用来关闭底部弹窗的事件
			})


			var first = null;
			mui.back = function() {
				mui.plusReady(function() {
					//首页返回键处理
					//处理逻辑：1秒内，连续两次按返回键，则退出应用；
					if (!first) {
						first = new Date().getTime();
						mui.toast('再按一次退出应用');
						setTimeout(function() {
							first = null;
						}, 1000);
					} else {
						if (new Date().getTime() - first < 1000) {
							plus.runtime.quit();
						}
					}
				});
			}

			mui.plusReady(function() {

				var selfIndex = plus.webview.currentWebview();
				//获取传入参数
				userInfo = selfIndex.param;
				MapObj.init();
				// MAP.addLayer(MapObj.sfqgqLayer);
				var h = screen.height;
				var w = screen.width;
				var scrollh = h - 30;
				var h2 = document.body.scrollHeight;
				//var shortcutsH = h2 - 100;
				var shortcutsW = w - 50;
				//var cehuaH = h2 - 50;

				var shortcutsH1 = GMQuery.shortcutsH1 = h - 85;
				var shortcutsH2 = GMQuery.shortcutsH2 = h - 215;

				var cehuaH1 = GMQuery.cehuaH1 = h - 60;
				var cehuaH2 = GMQuery.cehuaH2 = h - 190;
				var bottomContainerTop1 = GMQuery.bottomContainerTop1 = h2;
				var bottomContainerTop45 = GMQuery.bottomContainerTop2 = h2 - 140;
				var bottomContainerTop46 = h2 - 172;

				$('#scrollDiv').css("margin-top", "70px");
				$('#scrollDiv').css("height", scrollh.toString() + "px");

				$('#attachmentScrollDiv').css("margin-top", "70px");
				$('#attachmentScrollDiv').css("height", scrollh.toString() + "px");

				$('#sideBar_1').css("margin-left", shortcutsW.toString() + "px");
				$('#sideBar_2').css("margin-left", shortcutsW.toString() + "px");

				$('#bottomBar_left').css("margin-top", shortcutsH1.toString() + "px");

				$('#cehua').css("margin-top", cehuaH1.toString() + "px");
				$('#bottomBar_left').css("margin-top", shortcutsH1.toString() + "px");
				$('#bottomContainer').css("margin-top", bottomContainerTop1.toString() + "px");
				// $('#bottomContainer').css("margin-top", bottomContainerTop1.toString() + "px");
				$('#ranges').css("margin-top", bottomContainerTop45.toString() + "px");
				$(".bar").css("top",bottomContainerTop46.toString() + "px")


				// const sliderElement = document.getElementById('Slider');
				// sliderElement.onchange = function (){
				// 	// mui.alert("value = " + sliderElement.value);
				// 	let value = sliderElement.value
				// 	if(value == 1){
				// 		mui.toast("哈哈哈")
				// 		MAP.addLayer(MapObj.imageYD2Layer);
				// 		MAP.removeLayer(MapObj.imageYD4Layer);
				// 	}else if(value == 2){
				// 		mui.toast("啦啦啦")
				// 		MAP.addLayer(MapObj.imageYD4Layer);
				// 		MAP.removeLayer(MapObj.imageYD2Layer);
				// 	}
				// }

				// mui("#Slider").on()

				// function getSliderValue() {
				// 	mui.alert("value = " + sliderElement.value);
				// }

				$(window).resize(function() {
					var hh = document.body.scrollHeight;
					if (h2 > hh) {
						$('.mui-bar-tab').css("display", "none");

					} else {
						$('.mui-bar-tab').css("display", "block");
					}
					h2 = hh;
				});

				mui('.mui-scroll-wrapper').scroll({
					scrollY: true, //是否竖向滚动
					scrollX: false, //是否横向滚动
					startX: 0, //初始化时滚动至x
					startY: 0, //初始化时滚动至y
					indicators: false, //是否显示滚动条
					deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
					bounce: true //是否启用回弹
				});
				var arr = $(".bar-button")
			for(var i = 0 ; i < arr.length;i++){
				$(arr[i]).on("tap",function(event){
					$(arr).css("background","");
					$(this).css("background","red")
				})
				$(arr[4]).on("tap",function(event){
					MAP.removeLayer(MapObj.imageYD5Layer);
					MAP.removeLayer(MapObj.imageYD8Layer);
					MAP.removeLayer(MapObj.imageYD9Layer);
					MAP.removeLayer(MapObj.imageYD10Layer);
					MAP.addLayer(MapObj.imageYD2Layer);
					
				})
				$(arr[3]).on("tap",function(event){
					MAP.removeLayer(MapObj.imageYD2Layer);
					MAP.removeLayer(MapObj.imageYD8Layer);
					MAP.removeLayer(MapObj.imageYD9Layer);
					MAP.removeLayer(MapObj.imageYD10Layer);
					MAP.addLayer(MapObj.imageYD5Layer);
					
				})
				$(arr[2]).on("tap",function(event){
					MAP.removeLayer(MapObj.imageYD2Layer);
					MAP.removeLayer(MapObj.imageYD5Layer);
					MAP.removeLayer(MapObj.imageYD9Layer);
					MAP.removeLayer(MapObj.imageYD10Layer);
					MAP.addLayer(MapObj.imageYD8Layer);
					
				})
				$(arr[1]).on("tap",function(event){
					MAP.removeLayer(MapObj.imageYD2Layer);
					MAP.removeLayer(MapObj.imageYD5Layer);
					MAP.removeLayer(MapObj.imageYD8Layer);
					MAP.removeLayer(MapObj.imageYD10Layer);
					MAP.addLayer(MapObj.imageYD9Layer);
					
				})
				$(arr[0]).on("tap",function(event){
					MAP.removeLayer(MapObj.imageYD2Layer);
					MAP.removeLayer(MapObj.imageYD5Layer);
					MAP.removeLayer(MapObj.imageYD8Layer);
					MAP.removeLayer(MapObj.imageYD9Layer);
					MAP.addLayer(MapObj.imageYD10Layer);
					
				})
			}
			
				// mui.alert(arr)
				// $("#first").on("tap",function(event){
				// 	$(this).css("background","red")
				// })
				
				

				$('.mui-inner-wrap').on('drag', function(event) {
					event.stopPropagation();
				}); //阻止侧滑，侧滑时间给地图
				//$('.accordion').on(event)
				$('.mui-inner-wrap').on('tap', function(event) {
					//if(this.ATTR("type"))
					//event.stopPropagation();
					document.activeElement.blur();
					$("input").blur();
					// $('#bottomContainer').css("display","none");
				});

				$('#canvasBackdrop').on('tap', function(event) {
					offCanvasWrapperHide();
					console.log("颠倒")
					// $('#bottomContainer').css("display","none");
					// bottomContainerHide();
				});

				//改成tap
				$('#cehua').on('tap', function(event) {
					// // if (resultDisplay == 1) {
					// 	AllWindowClose();
					// 	openResultWin();
					// 	offCanvasWrapperSecondShow();
					// // }
					$('#resultListWin').css('display', 'block');
					$('#attachmentWin').css('display', 'none');
					$('#layerWin').css('display', 'none');
					// openResult();
					// offCanvasWrapperShow();()
					offCanvasWrapperSecondShow()
					// openLayerWin();
					$("#search").css("display", "none")

				});
				var btn_multpi = document.getElementById("searchMultiplBtn");
				//监听点击事件：条件查询
				btn_multpi.addEventListener("tap", function(event) {
					MapObj.mapClear();
					AllWindowClose();
					//offCanvasWrapperShow();
					mui.openWindow({
						url: "html/dtjSearch.html",
						id: "duotiaojian",
						styles: {
							popGesture: "close",
							statusbar: {
								background: "#f7f7f7"
							}
						},
						extras: {
							mark: "index" //额外的参数，仅仅是个标识，实际开发中不用；
						},
						show: {}
					});

				});

				var btn_userInfo = document.getElementById("userInfo");
				//监听点击事件：个人信息
				btn_userInfo.addEventListener("tap", function(event) {
					MapObj.mapClear();
					AllWindowClose();
					//offCanvasWrapperShow();
					mui.openWindow({
						url: "html/userInfo.html",
						id: "userInfo",
						styles: {
							popGesture: "close",
							statusbar: {
								background: "#f7f7f7"
							}
						},
						extras: {
							param: userInfo
						},
						show: {}
					});

				});

				//				var btn_charts = document.getElementById("statisticsBtn");
				//				//监听点击事件：图表
				//				btn_charts.addEventListener("tap", function(event) {
				//					var url_chart = "html/stat.html";
				//					var aniShow = mui.os.plus ? "slide-in-right" : "zoom-fade-out";
				//					mui.openWindow({
				//						url: url_chart,
				//						id: 'stat',
				//						styles: {
				//							popGesture: "close",
				//							statusbar: {
				//								background: "#f7f7f7"
				//							}
				//						},
				//						show: {
				//							aniShow: aniShow,
				//						}
				//					});
				//
				//				}, {
				//					passive: true
				//				});

				var btn_location = document.getElementById("bottomBar_left");
				btn_location.addEventListener("tap", function() {

					MapObj.mapClear();
					AllWindowClose();

					if (plus.geolocation) {
						mui.toast('正在定位请稍候...');
						MAP.flyTo([window.latitude, window.longitude], 10)
						plus.geolocation.getCurrentPosition(function(p) {
							console.log(p, "9999")

							// MAP.flyTo([p.coords.longitude,p.coords.latitude], 13)  
							//chrli 得到的gcj02坐标系  必须加 provider'system' 
							var coords = GPS.gcj_decrypt_exact(p.coords.latitude, p.coords.longitude);
							console.log(coords,"999")

							MapObj.currentLat = coords.lat;
							MapObj.currentLon = coords.lon;

							// MAP.flyTo([31.40,121.24], 13)


							// MAP.setView([coords.lat, coords.lon], 18);
							if (MapObj.locationGrahicLayer) {
								MAP.removeLayer(MapObj.locationGrahicLayer);
							}
							if (MapObj.locationGrahicLayer2) {
								MAP.removeLayer(MapObj.locationGrahicLayer2);
							}

							// MAP.flyTo([coords.lat,coords.lat], 13)

							MapObj.locationGrahicLayer = L.circleMarker([coords.lat, coords.lon], {
								radius: 20,
								weight: 0,
								fillColor: '#1D8FFF',
								fillOpacity: 0.4
							}).addTo(MAP);
							MapObj.locationGrahicLayer2 = L.circleMarker([coords.lat, coords.lon], {
								radius: 5,
								weight: 0,
								fillColor: '#1D8FFF',
								fillOpacity: 1
							}).addTo(MAP);
						}, function(p) {}, {
							provider: 'system'
						});

						//{provider:'amap'}
						//{provider:'system'}
						// geoWatchPos();
					} else {
						mui.alert("无法调取定位功能", "提示");
					}
				});

				function geoWatchPos(callback) {
					//plus监控位置变化
					plus.geolocation.watchPosition(function(p) {
						var coords = GPS.gcj_decrypt_exact(p.coords.latitude, p.coords.longitude);
						// MAP.flyTo([p.coords.latitude,p.coords.longitude], 13) 
						// lat: 31.246661454732894
						// lon: 121.40793404940226   31.244833 121.412586
						// console.log(p.coords.latitude,p.coords.longitude)
						window.latitude = p.coords.latitude
						window.longitude = p.coords.longitude
						//MAP.setView([coords.lat, coords.lon], 18);

						MapObj.currentLat = coords.lat;
						MapObj.currentLon = coords.lon;
						// console.log(coords.lat, coords.lon)
						// MAP.flyTo([MapObj.currentLon,MapObj.currentLat], 13)
						if (MapObj.locationGrahicLayer) {
							MAP.removeLayer(MapObj.locationGrahicLayer);
						}
						if (MapObj.locationGrahicLayer2) {
							MAP.removeLayer(MapObj.locationGrahicLayer2);
						}
						MapObj.locationGrahicLayer = L.circleMarker([coords.lat, coords.lon], {
							radius: 25,
							weight: 0,
							fillColor: '#1D8FFF',
							fillOpacity: 0.3
						}).addTo(MAP);
						MapObj.locationGrahicLayer2 = L.circleMarker([coords.lat, coords.lon], {
							radius: 5,
							weight: 0,
							fillColor: '#1D8FFF',
							fillOpacity: 1
						}).addTo(MAP)
					}, function(e) {
						mui.toast('定位错误');
					}, {
						enableHighAccuracy: true,
						//						timeout:50000,
						provider: 'system'
					});
				}
				geoWatchPos();
				//图层选择控件修改
				document.getElementById("standardMapImg").addEventListener("tap", function() {
					$("#standardMapImg").addClass('selectedImg');
					$("#airMapImg").removeClass('selectedImg');
					$("#standardMapSpan").addClass('selectedSpan');
					$("#airMapSpan").removeClass('selectedSpan');
					MAP.removeLayer(MapObj.imageBasemapLayer);
					MAP.addLayer(MapObj.normalBasemapLayer);
					// MAP.addLayer(MapObj.sfqgqLayer);
					//					vectorLayer.show();
					//					//vectorLabelLayer.show();
					//					imageLayer.hide();
					//					imageLabelLayer.hide();
					mui.toast('标准地图');
				});
				document.getElementById("airMapImg").addEventListener("tap", function() {
					$("#standardMapImg").removeClass('selectedImg');
					$("#airMapImg").addClass('selectedImg');
					$("#standardMapSpan").removeClass('selectedSpan');

					$("#airMapSpan").addClass('selectedSpan');
					MAP.removeLayer(MapObj.normalBasemapLayer);
					MAP.addLayer(MapObj.imageBasemapLayer);
					// MAP.addLayer(MapObj.sfqgqLayer);

					//					vectorLayer.hide();
					//					//vectorLabelLayer.hide();
					//					imageLayer.show();
					//					imageLabelLayer.show();
					mui.toast('卫星地图');
				});
				//影像图
				// document.getElementById("imageSwitch").addEventListener("toggle", function(event) {
				// 	if (event.detail.isActive) {
				// 		MAP.addLayer(MapObj.imageLayer);
				// 		mui.toast('影像图')

				// 		// MAP.flyTo([31.40,121.24], 13)
				// 	} else {
				// 		MAP.removeLayer(MapObj.imageLayer);
				// 	}
				// })

				document.getElementById("landSwitch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.landLayer);

						window.show = true;
						mui.toast('三调图')
					} else {
						MAP.removeLayer(MapObj.landLayer);
						// MAP.addLayer(MapObj.sfqgqLayer);
						window.show = false;
					}
				})

				document.getElementById("planSwitch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.planLayer);
						mui.toast('规划图')
					} else {
						MAP.removeLayer(MapObj.planLayer);
					}
				})

				document.getElementById("terrianSwitch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.terrainLayer);
						mui.toast('地形图')
					} else {
						MAP.removeLayer(MapObj.terrainLayer);
					}
				})
				document.getElementById("starSwitch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.deepwellLayer);
						window.flag = true;

						// var arr = MAP._layers;
						// console.log(arr);
						// for(let i in arr){
						// 	console.log(arr[3]);
						// }
						//console.log(arr,typeof arr,arr.length);
						mui.toast('亮点图')
					} else {
						MAP.removeLayer(MapObj.deepwellLayer);
						window.flag = false;
					}
				})
				document.getElementById("img201904Switch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.image201904Layer);
						mui.toast('2019四季度影像图')
					} else {
						MAP.removeLayer(MapObj.image201904Layer);
					}
				})
				document.getElementById("img201903Switch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.image201903Layer);
						mui.toast('2019三季度影像图')
					} else {
						MAP.removeLayer(MapObj.image201903Layer);
					}
				})
				document.getElementById("img202003Switch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.image202003Layer);
						mui.toast('2020三季度影像图')
					} else {
						MAP.removeLayer(MapObj.image202003Layer);
					}
				})
				document.getElementById("img202002Switch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.image202002Layer);
						mui.toast('2020二季度影像图')
					} else {
						MAP.removeLayer(MapObj.image202002Layer);
					}
				})
				document.getElementById("img202001Switch").addEventListener("toggle", function(event) {
					if (event.detail.isActive) {
						MAP.addLayer(MapObj.image202001Layer);
						mui.toast('2020一季度影像图')
					} else {
						MAP.removeLayer(MapObj.image202001Layer);
					}
				})

				//				$("#deepwellLayerRangeInput3").bind('input porpertychange', function() {
				//					MapObj.deepwellLayer3.setOpacity($("#deepwellLayerRangeInput3").val() / 100);
				//				});


				mui('#shortcuts').on('tap', 'a', function() {
					var classes = $(this).attr("class");
					if (this.id == "measureBtn") {
						MapObj.mapClear();
						AllWindowClose();
						mui.toast('距离量测');
						toolbartag = 'DistanceMeasure';
						DrawTool.init();
						DrawTool.activate("polyline", toolbartag);
					}

					if (this.id == "areaBtn") {
						MapObj.mapClear();
						AllWindowClose();
						mui.toast('面积量测');
						toolbartag = 'AreaMeasure';
						DrawTool.init();
						DrawTool.activate("polygon", toolbartag);
					}

					if (this.id == "historyBtn") {
						mui.openWindow({
							url: "html/history.html",
							id: "history",
							extras: {
								param: {
									userInfo: userInfo
								}
							},
							styles: {
								popGesture: "close",
								statusbar: {
									background: "#f7f7f7"
								}
							}
						})

					}

					if (this.id == "eraserBtn") {
						resultDisplay = 0;
						$('#cehua').css('display', 'block');
						MapObj.mapClear();
						mui.toast('清除记录');
						//polygonSearch.clear();
						//DrawTool.clear();
					}

					if (this.id == "layerBtn") {
						// $('#resultList').css('display', 'none');
						AllWindowClose();
						// offCanvasWrapperShow();()
						offCanvasWrapperSecondShow()
						openLayerWin();
						$("#search").css("display", "none")
					}

				});
			});
		</script>
	</body>

</html>
